<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8"/>
    <title>控制台 - 教学管理系统首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <#include "../../head/common-css.ftl" />
    <#include "../../head/common-js.ftl" />
    <script>
        var options;
        $(function () {
            options = {
                url: 'doList.do',
                page: true,
                params: {},
                pageSize: 20,
                index: true,
                column: [{
                    name: 'realName',
                    title: '真实姓名',
                    width: 80,
                    align: 'center'
                }, {
                    name: 'loginName',
                    title: '登录姓名',
                    width: 80,
                    align: 'center'
                }, {
                    name: 'createTime',
                    title: '注册时间',
                    width: 130,
                    align: 'center',
                    render: function (value) {
                        if (value) {
                            return formatTime(value.time)
                        }
                        return '无时间'
                    }
                }, {
                    name: 'type',
                    title: '类型',
                    width: 80,
                    align: 'center',
                    render: function (value) {
                        if (value == '1') {
                            return '有效';
                        }
                        return '无效';
                    }
                }, {
                    name: 'status',
                    title: '状态',
                    width: 80,
                    align: 'center',
                    render: function (value) {
                        if (value == '1') {
                            return '<span class="text-success"><strong>有效</strong></span>';
                        }
                        return '<span class="text-danger"><strong>无效</strong></span>';
                    }
                }, {
                    name: 'id',
                    title: '操作',
                    width: 80,
                    align: 'center',
                    render: function (value, data) {
                        var operate = '<div class="btn-group">';
                        // 详细按钮
                        operate += '<button class="btn btn-xs btn-success" onclick="showDetail(\'' + value + '\')"> <i class=" icon-eye-open bigger-120"></i> </button>';
                        if (data.status == 1) {
                            // 删除按钮
                            operate += '<button class="btn btn-xs btn-danger" onclick="changeUserStatus(\'' + value + '\',\'' + 2 + '\')"> <i class="icon-trash bigger-120"></i> </button>';
                            // 授予角色
                            operate += '<button class="btn btn-xs btn-info" onclick="authorized(\'' + value + '\')"> <i class="icon-group bigger-120"></i> </button>';
                            // 用户信息修改
                            operate += '<button class="btn btn-xs btn-warning" onclick="operate(\'' + value + '\')"> <i class="icon-edit bigger-120"></i> </button>';
                            // 重置密码
                            operate += '<button class="btn btn-xs btn-pink" onclick="resetPwd(\'' + value + '\')"> <i class="glyphicon glyphicon-registration-mark bigger-120"></i> </button>';
                        } else {
                            // 删除按钮
                            operate += '<button class="btn btn-xs btn-success" onclick="changeUserStatus(\'' + value + '\',\'' + 1 + '\')"> <i class="icon-ok bigger-120"></i> </button>';
                        }
                        operate += '</div>';
                        return operate;
                    }
                }]
            };
            var list = $('#user_list').table(options);
            window.setTimeout(function () {
                reinitTreeHight(window.parent.getIframeByElement(document.body));
            }, 200);
            // 点击搜索按钮
            $('#searchBtn').click(function () {
                options.params.realName = $('#queryRealName').val();
                options.params.loginName = $('#queryLoginName').val();
                $('#user_list').table(options);
            })
        });

        function showDetail(id) {
            top.layer.open({
                type: 2,
                title: '用户详细信息',
                shadeClose: true,
                shade: 0.8,
                area: ['80%', '60%'],
                content: '${request.contextPath}/sys/user/detail.htm?userId=' + id
            });
        }

        function changeUserStatus(id, status) {
            layer.confirm(status == 2 ? '<span class="text-danger"><strong>是否确认要删除该用户!!!</strong></span>' : '<span class="text-success"><strong>是否确认要恢复该用户.</strong></span>', {
                btn: ['确认', '取消'] //按钮
            }, function (index) {
                //进行ajax传值
                $.ajax({
                    url: "${request.contextPath}/sys/user/changeStatus.do",
                    type: "post",
                    dataType: "json",
                    data: {
                        'userId': id,
                        'status': status
                    },
                    success: function (msg) {
                        //要执行的代码
                        if (!msg.success) {
                            layer.msg(msg.msg, {icon: 2});
                            return;
                        }
                        // 注册成功,跳转到学员信息补全页面
                        layer.msg(status == 2 ? "删除成功" : "恢复成功", {icon: 6, time: 500}, function () {
                            $('#user_list').table(options);
                        });
                    }
                });
                layer.close(index);
            });
        }
    </script>
</head>
<body>
<div class="table-responsive page-content">
    <form class="form-inline">
        <label for="real_name">真实名称:</label>
        <div class="form-group">
            <div class="input-group">
                <input type="text" class="input-medium" id="queryRealName">
            </div>
        </div>
        <label for="login_name">登录名:</label>
        <div class="form-group">
            <div class="input-group">
                <input type="text" class="input-medium" id="queryLoginName">
            </div>
        </div>
        <button type="button" id="searchBtn" class="btn btn-info btn-xs">
            <i class="icon-eye-open"></i>
            查询
        </button>
        <button type="button" onclick="operate()" class="btn btn-info btn-xs">
            <i class=" icon-book"></i>
            添加用户
        </button>
    </form>
    <div class="space-4"></div>
    <!-- table start -->
    <table class="table-list" id="user_list">

    </table>
    <!-- table end -->
    <div class="am-g">
        <div class="am-u-sm-12">
            <div class="pager" id="page"></div>
        </div>
    </div>
</div>


<!-- 弹出模态窗口-->
<div class="modal fade" tabindex="-1" role="dialog" id="useAuthModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- 内容会加载到这里 -->
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- 弹出模态窗口-->
<div class="modal fade" tabindex="-1" role="dialog" id="useAddModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- 内容会加载到这里 -->
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script>
    var userId;

    // 修改操作
    function authorized(id) {
        userId = id;
        $("#useAuthModal").modal({
            backdrop: 'static',  	// 点击空白不关闭
            keyboard: false,		// 按键盘esc也不会关闭
            remote: '${request.contextPath}/sys/user/author.htm?userId=' + id	// 从远程加载内容的地址
        });
    }

    // dialog展示事件
    $('#useAuthModal').on('shown.bs.modal', function () {
        //捕获show事件
        var modal = $(this);  //get modal itself
        modal.find('.modal-body #userId').val(userId);
        role_options.params.id = userId;
        $('#modal_role_list').table(role_options);
    });

    $("#useAuthModal").on("hidden.bs.modal", function () {
        $(this).removeData("bs.modal");
    });


    // 点击搜索按钮
    function operate(id) {
        $("#useAddModal").modal({
            backdrop: 'static',  	// 点击空白不关闭
            keyboard: false,		// 按键盘esc也不会关闭
            remote: '${request.contextPath}/sys/user/operate.htm?id=' + id	// 从远程加载内容的地址
        });
    }

    function resetPwd(id) {
        layer.confirm('是否确认重置密码,重置后的密码为:<span class="text-success strong">六个0,</span><span class="text-danger strong">请及时修改密码.</span>', {
            btn: ['确认', '取消'], //按钮
            icon: 3,
            title: '重置密码',
            area: ['450px', '180px']
        }, function (index) {
            //进行ajax传值
            $.ajax({
                url: "${request.contextPath}/sys/user/doRestPwd.do",
                type: "post",
                dataType: "json",
                data: {
                    'id': id
                },
                success: function (msg) {
                    //要执行的代码
                    if (!msg.success) {
                        layer.msg(msg.msg, {icon: 2});
                        return;
                    }
                    // 注册成功,跳转到学员信息补全页面
                    layer.msg("重置成功", {icon: 6, time: 500}, function () {
                        $('#user_list').table(options);
                    });
                }
            });
            layer.close(index);
        });
    }
</script>
</body>